import React, { useState } from 'react'
import style from './style.module.scss'
import { Link } from 'react-router-dom'

interface ICloseAccountFormProps {
    userId: string
}

export default function CloseAccountForm(props: ICloseAccountFormProps) {
    const [psd, setPsd] = useState('')

    return (
        <div className={style.container}>
            <span className={style.title}>注销账号</span>
            <span className={style.warring}>
                <span>警告</span>：关闭您的帐户是不可逆的。它会删除您的所有照片、收藏和统计信息。
            </span>
            <div className={style.password__input}>
                <span>当前密码:</span>
                <input
                    type="password"
                    value={psd}
                    onChange={e => {
                        setPsd(e.target.value)
                    }}
                />
            </div>
            <div className={style.del__btn}>
                <div className={style.btn}>注销</div>
            </div>
            <div className={style.del__photo}>
                <b>📸 删除照片</b>
                <span>
                    删除你的帐户将从会LineView中删除你的所有照片。但是<Link to={'/license'}>LineView许可证</Link>
                    是不可撤销的，因此在删除之前下载的照片副本仍然可以使用。
                </span>
                <span>
                    如果只是想删除照片，可以从“<Link to={'/user/photos/' + props.userId}>管理照片</Link>”中删除。
                </span>
            </div>
        </div>
    )
}
